<script type="text/javascript" src="js/plugin/topo/fmatColVal.js"></script>
	<script type="text/javascript">
	
	function resetColor(isGroup){
		if(isGroup == "isFont"){
			//$(window.frames["fontcoloriframe"].document).find("#baseColorModel").val("fontcolor");
			//var input_color = $(window.frames["fontcoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input");
			//$("#modifyGroupStlye").find("input[name='fontcolor']").val(input_color.val().colorRgb());
			//document.getElementById("fontcoloriframe").contentWindow.resetFontColor();
			//$(window.frames["fontcoloriframe"].document).find("#baseModel").val("modifyGroupStlye");
			
		}else if(isGroup == "border"){
			$(window.frames["groupbordercoloriframe"].document).find("#baseColorModel").val("color");
			var input_color = $(window.frames["groupbordercoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input");
			$("#modifyGroupStlye").find("input[name='border_color']").val(input_color.val().colorRgb());
			$(window.frames["groupbordercoloriframe"].document).find("#baseModel").val("modifyGroupStlye");
		}
		else if(isGroup=="isGroup"){
			$(window.frames["groupcoloriframe"].document).find("#baseColorModel").val("color");
			var input_color = $(window.frames["groupcoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input");
			$("#modifyGroupStlye").find("input[name='color']").val(input_color.val().colorRgb());
			$(window.frames["groupcoloriframe"].document).find("#baseModel").val("modifyGroupStlye");
			
		}else{
			$(window.frames["coloriframe"].document).find("#baseColorModel").val("color");
			var input_color = $(window.frames["coloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input");
			$("#canvasDrawShowAttrLine").find("input[name='color']").val(input_color.val().colorRgb());
			$(window.frames["coloriframe"].document).find("#baseModel").val("canvasDrawShowAttrLine");
			
		}

	}
	$(function(){
		$("#stageSelectMode,#correlation_delete").click(function(){
			if($(this).attr("clickTime") != true && $(this).attr("clickTime")!= "true"){
				$(this).css("background-color","#275e93");
				$(this).attr("clickTime",true);
			}
			else{
				$(this).css("background-color","");
				$(this).removeAttr("clickTime");
			}
		});
	});
	function getIsSelectById(id){
		if($("#"+id).attr("clickTime") == true || $("#"+id).attr("clickTime") == 'true'){
			return true;
		}
		return false;
	} 
	function establishRelationshipModel_isDelete(){
		return getIsSelectById("correlation_delete");
	}
	function setLineSize(w){
		$("#lineSize"+w).trigger("click");
	}
	function setFontSize(size){
		$("#modifyGroupStlye").find("select[name='fontsize']").val(size);
	}
	function setColor(color,isGroup){
		var hex = ("RGB("+color+")").colorHex();
		if(isGroup == "isFont"){
			//$(window.frames["groupcoloriframe"].document).find("#baseColor").val(hex);
			//$(window.frames["groupcoloriframe"].document).find("#baseColor").trigger("change");
			//$(window.frames["fontcoloriframe"].document).find("#baseColorModel").val("fontcolor");
			//document.getElementById("fontcoloriframe").contentWindow.setFontColor(color); 
			//设置模式
			//$(window.frames["fontcoloriframe"].document).find("#baseModel").val("modifyGroupStlye");
			//$(window.frames["fontcoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").val(hex);
			
			//$(window.frames["fontcoloriframe"].document).find("#baseColor").trigger("change");
			//$(window.frames["fontcoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").trigger("blur");
		}
		else if(isGroup != undefined){
			$("#modifyGroupStlye").find("input[name='color']").val(color);
			$(window.frames["groupcoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").trigger("focus");
			//$(window.frames["fontcoloriframe"].document).find("#baseColorModel").val("color");
			$(window.frames["groupcoloriframe"].document).find("#baseColor").val(hex);
			
			//设置模式
			$(window.frames["groupcoloriframe"].document).find("#baseModel").val("modifyGroupStlye");
			$(window.frames["groupcoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").val(hex);
			$(window.frames["groupcoloriframe"].document).find("#baseColor").trigger("change");
			$(window.frames["groupcoloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").trigger("blur");
		}
		else{
			$("#canvasDrawShowAttrLine").find("input[name='color']").val(color);
			$(window.frames["coloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").trigger("focus");
			$(window.frames["coloriframe"].document).find("#baseColorModel").val("color");
			$(window.frames["coloriframe"].document).find("#baseColor").val(hex);

			$(window.frames["coloriframe"].document).find("#baseModel").val("canvasDrawShowAttrLine");
			$(window.frames["coloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").val(hex);
			
			$(window.frames["coloriframe"].document).find("#baseColor").trigger("change");
			
			$(window.frames["coloriframe"].document).find(".sp-input-container,.sp-cf").find(".sp-input").trigger("blur");
		}


	}
	function setSlider(s,isGroup)
	{
		var iframeId = "slideriframe";
		if(isGroup != undefined){
			iframeId = "slideriframe2";
			$("#modifyGroupStlye").find("input[name='slider']").val(s);
			$(window.frames["slideriframe2"].document).find("#parentId").val("modifyGroupStlye");
		}
		else{
			$("#canvasDrawShowAttrLine").find("input[name='slider']").val(s);
			$(window.frames["slideriframe"].document).find("#parentId").val("canvasDrawShowAttrLine");
		}
			
		//jquery-completed
		var pW = Number($(window.frames[iframeId].document).find(".defaultbar").width());
		var w = pW*Number(s);
		$(window.frames[iframeId].document).find(".jquery-completed").width(w);
		var w2 = Number($(window.frames[iframeId].document).find(".jquery-jslider").width());
		$(window.frames[iframeId].document).find(".jquery-jslider").css("left",w+"PX");
		$(window.frames[iframeId].document).find("#showslider").text(s);
		
	}
	</script>

<ul id="node_menu" class="contextmenu" style="display:none;z-index: 10;" tabindex="999">
	<li id="textnode"><a>更改属性</a></li>
	<li id="reset"><a>恢复云图</a></li>
	<li><a>删除节点</a></li>
</ul>
<ul id="link_menu" class="contextmenu" style="display:none;z-index: 10;" tabindex="999">
	<li><a>更改属性</a></li>
	<li><a>端口配置</a></li>
	<li><a>删除连线</a></li>
</ul>
<ul id="container_menu" class="contextmenu" style="display:none;z-index: 10;" tabindex="999">
	<li><a>更改属性</a></li>
	<li><a>增删节点</a></li>
	<!-- <li><a>撤销上一次操作</a></li> -->
	<li><a>删除容器</a></li>
</ul>

<div class="topo-editor shrink-right">
	<div class="topo-left">
		<div class="wraper" id="canvasTool" style="padding-top: 30px;padding-bottom: 30px;">
		</div>
	</div>
	<div class="topo-right">
		<div class="menu-bar">
			<div class="p-title">
				<p id="titlename">拓扑图名称显示位置</p>
			</div>
			<a class="toggle-btn active" href="javascript:void(0);">
				<i class="toggle"></i>
			</a>
			<ul class="ul-caozuo ui-align ul-separator">
				<li class="align-left align" data-wenk='左对齐' data-wenk-pos="bottom" name="modifyFunction" value="left">
					<i class="topo-align-left topo"></i>
				</li>
				<li class="align-right align" data-wenk='右对齐' data-wenk-pos="bottom" name="modifyFunction" value="right">
					<i class="topo-align-right topo"></i>
				</li>
				<li class="align-top align" data-wenk='上对齐' data-wenk-pos="bottom" name="modifyFunction" value="up">
					<i class="topo-align-top topo"></i>
				</li>
				<li class="align-bottom align" data-wenk='下对齐' data-wenk-pos="bottom" name="modifyFunction" value="down">
					<i class="topo-align-bottom topo"></i>
				</li>
				<li class="caozuo-group" id="stageSelectMode" data-wenk='分组' data-wenk-pos="bottom">
					<i class="topo-group-btn topo"></i>
				</li>
				<li id="createcloud" data-wenk="生成云图" data-wenk-pos="bottom">
					<i class="icon-cloud topo" style="color:white;font-size: 16px;display: flex;align-items: center;justify-content: center;"></i>
				</li>
				<li data-id="query" data-wenk="搜索" data-wenk-pos="bottom">
					<i class="topo-query-btn topo"></i>
				</li>
				<li data-id="bgi" data-wenk="上传背景图片" data-wenk-pos="bottom">
					<i class="topo-upload-bgi topo"></i>
				</li>
				<li data-id="setBgi" data-wenk="设置背景图片" data-wenk-pos="bottom">
					<i class="topo-set-bgi topo"></i>
				</li>
			</ul>
			<ul class="ul-caozuo ui-query ul-separator">
				<li style="width: auto;display: none;">
					<input type="text" name="query_input" id='query_input'>
				</li>
				<li id="query_btn" style="display: none;">
					<i class="topo-query-btn topo"></i>
				</li>
				<li id="other_btn">
					<i class="topo-other-btn topo"></i>
				</li>
			</ul>
		</div>
		<div class="drawing-board-bg">
			<div class="drawing-board">
				<div class="board" style="background-color: #0c0c0e;">
					<canvas id="canvasDraw" width="800px" height="500px"></canvas>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="other-menu">
	<ul>
		<li id="exportJSONData">
			<i class="icon-save topo"></i><span>保存</span>
		</li>
		<li id="reSetMessage">
			<i class="icon-edit topo"></i><span>基本信息</span>
		</li>
		<li id="emptyScene">
			<i class="icon-trash topo"></i><span>清空</span>
		</li>
	</ul>
</div>
<script src="module/monitor_config/topo_manage_detail.js"></script>